<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <script type="text/javascript" src="../static/lib/html5shiv.js"></script>
    <script type="text/javascript" src="../static/lib/respond.min.js"></script>
    <script type="text/javascript" src="../static/lib/jquery/1.9.1/jquery.min.js"></script>
    <link rel="stylesheet" href="../static/h-ui/css/H-ui.css" />
    <script type="text/javascript" src="../static/h-ui/js/H-ui.js"></script>
    <link rel="stylesheet" href="../static/css/company.css" />
    <meta charset="UTF-8">
    <title>MVO-My Information</title>
</head>
<body>
<script type="text/javascript">

</script>
    <div class="panel1">
        <div class="panel-header1">Company Information</div>
        <div class="panel-body1">
            <!-- Table -->
            <table class="table">
                <tbody>
                <tr>
                    <td class="text-r" width="130">公司名称（中文）：</td>
                    <td width="120"><span id="namecn" th:text="${nameCn}"></span></td>
                    <td class="text-r" width="130">品牌商认证类型：</td>
                    <td width="170"><span id="rtype" th:text="${rType}"></span></td>
                </tr>
                <tr>
                    <td class="text-r">公司名称（英文）：</td>
                    <td><span id="nameen" th:text="${nameEn}"></span></td>
                    <td class="text-r">证书地址：</td>
                    <td><span id="rurl" th:text="${rUrl}"></span></td>
                </tr>
                <tr>
                    <td class="text-r">公司简介：</td>
                    <td><span id="info" th:text="${info}"></span></td>
                </tr>
                </tbody>
            </table>
        </div>
        <input class="btn btn-primary-outline radius btn-location" type="button" value="编辑" id="btnComEdit">
    </div>
    <div style="margin-left: 30%; margin-top: 50px;">
        <input class="btn btn-secondary radius" type="button" onClick="modaldemo()" value="新增品牌">
    </div>
    <div class="panel1">
        <div class="panel-header1">Brand Information</div>
        <div>
            <!-- Table -->
            <table id="table" class="table table-border table-bordered table-hover" style="border-radius: 5px;">
                <thead>
                    <tr>
                        <th width="20px"></th>
                        <td width="50%" style="text-align: center;">品牌名称</td>
                        <td width="15%" style="text-align: center;">品牌logo</td>
                        <td style="text-align: center;">操作</td>
                    </tr>
<!--                    <tr th:each="brand:${brand}">-->
<!--                        <td th:text="${brand.brandName}"></td>-->
<!--&lt;!&ndash;                        <td th:text="${brand.logo}"></td>&ndash;&gt;-->
<!--                        <td><img th:src="@{${brand.logo}}"  width="100" height="100"></td>-->
<!--                    </tr>-->
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="modal-demo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content radius">
                    <div class="modal-header">
                        <h3 class="modal-title">Add Brand</h3>
                        <a class="close" data-dismiss="modal" aria-hidden="true" href="javascript:void(0);">×</a>
                    </div>
                    <div class="modal-body">
                        <form action="/brand/addbrand" method="post" enctype="multipart/form-data">
                            <table>

                                <tr>

                                    <td style="font-size: 16px;" height="50">品牌名称：</td>
                                    <td>
                                        <div class="formControls col-xs-8 col-sm-9">
                                            <input type="text" class="input-text" value="" placeholder="" id="brandName" name="brandName">
                                        </div>
                                </tr>
                                <tr>
                                    <td style="font-size: 16px" height="50">logo：</td>
                                    <td>
                                        <span class="btn-upload form-group">
                                            <input class="input-text upload-url radius" type="text" name="file" id="file" readonly><a href="javascript:void(0);" class="btn btn-primary radius"><i class="iconfont">&#xf0020;</i> 浏览文件</a>
                                            <input type="file" multiple name="file-1" class="input-file">
                                        </span>
<!--                                        <input type="text" name="sfile" id="pic"><br>-->
<!--                                        <p id="url"><img src="" width="100" height="100"></p>-->
<!--                                        <input type="button" value="上传" id="upload"/><br>-->
                                    </td>
                                </tr>
                            </table>
<!--                            <input type="submit" value="添加" />-->
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="../static/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="../static/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="../static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="../static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="../static/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="../static/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="../static/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="../static/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript">

    window.onload = getbrand;
    var brands = []

    function tableadd(){
        var table = document.getElementById('table');
        for(var i = 1; i<=brands.length; i++){
            table.innerHTML += "<tr>\n" +
                "<td style=\"text-align: center;\">"+i+"</td>\n" +
                "<td style=\"text-align: center;\">"+brands[i-1].brandName+"</td>\n" +
                "<td style=\"text-align: center;\"><img src=\""+brands[i-1].logo+"\"></td>\n" +
                //
                // "<td style=\"text-align: center;\"><input class=\"btn btn-primary-outline radius\" type=\"button\" value=\"编辑\">\n" +
                "<td><input class=\"btn btn-danger-outline radius\" type=\"button\" value=\"删除\" onclick='btndel("+i+")'></td>\n"+
                "</tr>";
        }
    }

    function getbrand(){
        var companyId = [[${companyId}]];
        $.ajax({
            type:'POST',
            url:'/brand/getbrand',
            contentType:"application/json",
            data:JSON.stringify({"companyId":companyId}),
            dataType:'json',
            success:function (data) {
                console.log(data.data)
                brands = data.data;
                tableadd();
            }
        });
    }

    function getComInfo(){
        var companyId = [[${companyId}]];
        var nameCn = $("#namecn").text();
        var nameEn = $("#nameen").text();
        var GMCtype = $("#rtype").text();
        var comURL = $("#rurl").text();
        var cinfo = $("#info").text();
        var comInfo = {
            'companyId':companyId,
            'nameCn':nameCn,
            'nameEn':nameEn,
            'cinfo':cinfo,
            'rType':GMCtype,
            'rUrl':comURL,
        }
        console.log(comInfo)
        return comInfo;
    }


    $("#btnComEdit").click(function() {
        var msg=getComInfo();
        console.log("btncomedit")
        console.log(msg);
        url="/mvo/goeditcompany?"+"companyId="+msg.companyId+"&nameCn="+msg.nameCn+"&nameEn="+msg.nameEn+
            "&cinfo="+msg.cinfo+"&rType="+msg.rType+"&rUrl="+msg.rUrl;
        window.location.href = url;
    })

    function modaldemo(){
        $("#modal-demo").modal("show")
    }


    $(function () {
        $("#upload").click(function () {//点击事件--》上传图片
            //获取表单对象
            var form = new FormData();
            //接受表单第一个上传的数据，file命名不能和form里面的名字重复，为传到.java页面的值
            form.append("file",document.getElementById("file").files[0]);
            form.append("brandName",$("#brandName").val());
            $.ajax({
                url: "/brand/upload",//后台url
                type: "POST",//类型为post或get
                dataType: 'json',//数据返回类型，可以使xml，json等
                data: form,
                cache: false,
                async: false,
                processData: false,
                contentType: false,
                success:function (data) {//接受.java页面的参数
                    //document.write("1");
                    // alert(JSON.stringify(data));
                    // if (data){
                    //     var pic = "/imctemp-rainy/"+data.fileName;
                    //     $("#pic").val("/imctemp-rainy/"+data.fileName);
                    //     $("#url img").attr("src",pic);//attr() 方法设置或返回被选元素的属性值。
                    // }else {
                    //     alert("失败");
                    // }
                    window.location.href="/mvo/getmvoinfo"
                }
            })

        })
    })
    function btndel(i){
        console.log(brands);
        var brandId = brands[i-1].brandId;
        console.log("brandId",brandId);
        store = {
            'brandId':brandId,
            'state':'0'
        }
        $.ajax({
            type:'POST',
            url:'/brand/delbrand',
            contentType:"application/json",
            data:JSON.stringify(store),
            dataType:'json',
            success:function (data) {
                console.log(data.data)
                window.location.href="/mvo/getmvoinfo";
            }
        });
    }



</script>
</body>
</html>